<template>
  <view class="page flex-col">
    <view class="mod1 flex-col">
      <view class="section1 flex-col justify-between">
        <view class="outer1 flex-col">
          <view class="section2 flex-col">
            <view class="section3 flex-row">
              <text class="info1">9:41</text>
              <view class="block1 flex-col"></view>
              <view class="block2 flex-col"></view>
              <view class="block3 flex-col"></view>
            </view>
            <view class="TextGroup1 flex-col justify-between">
              <text class="info2">我的喜欢</text>
              <text class="word1">234个喜欢</text>
            </view>
            <view class="section4 flex-row">
              <view
                class="outer2 flex-col"
                :style="{ background: item.lanhuBg0 }"
                v-for="(item, index) in loopData0"
                :key="index"
              >
                <text
                  class="txt1"
                  :style="{ color: item.lanhufontColor0 }"
                  v-html="item.lanhutext0"
                ></text>
              </view>
            </view>
          </view>
        </view>
        <view class="outer3 flex-col">
          <view class="outer4 flex-row">
            <view class="box1">
              <text class="word2">虚拟人贝拉</text>
              <text class="info3">戴维斯工作室</text>
              <text class="txt2"></text>
            </view>
          </view>
          <view class="outer5 flex-row justify-between">
            <view class="block4 flex-col"></view>
            <text class="word3">4.6</text>
          </view>
          <view class="outer6 flex-row justify-between">
            <view class="layer1 flex-col"></view>
            <view class="layer2 flex-col justify-between">
              <view class="bd1 flex-col"><text class="word4">海外</text></view>
              <view class="ImageText1 flex-row justify-between">
                <view class="mod2 flex-col"></view>
                <view class="TextGroup2 flex-col">
                  <text class="word5">2022/05/22</text>
                </view>
              </view>
            </view>
          </view>
          <view class="outer7 flex-row">
            <view class="section5">
              <text class="txt3">阿凡达品牌</text>
              <text class="info4">&nbsp;Vian工作室</text>
            </view>
          </view>
          <view class="outer8 flex-row justify-between">
            <view class="section6 flex-col"></view>
            <text class="word6">4.6</text>
          </view>
          <view class="outer9 flex-row justify-between">
            <view class="mod3 flex-col"></view>
            <view class="mod4 flex-col justify-between">
              <view class="wrap1 flex-col">
                <text class="word7">品牌</text>
              </view>
              <view class="ImageText2 flex-row justify-between">
                <view class="group1 flex-col"></view>
                <view class="TextGroup3 flex-col">
                  <text class="info5">2022/05/20</text>
                </view>
              </view>
            </view>
          </view>
          <view class="outer10 flex-row">
            <view class="outer11">
              <text class="word8">玩偶形象</text>
              <text class="txt4">&nbsp;congry</text>
            </view>
          </view>
          <view class="outer12 flex-row justify-between">
            <view class="main1 flex-col"></view>
            <text class="info6">4.6</text>
          </view>
          <view class="outer13 flex-row justify-between">
            <view class="mod5 flex-col"></view>
            <view class="mod6 flex-col justify-between">
              <view class="bd2 flex-col"><text class="info7">形象</text></view>
              <view class="ImageText3 flex-row justify-between">
                <view class="outer14 flex-col"></view>
                <view class="TextGroup4 flex-col">
                  <text class="word9">1h&nbsp;37m</text>
                </view>
              </view>
            </view>
          </view>
          <view class="outer15 flex-col"></view>
          <view class="outer16 flex-col"></view>
          <view class="outer17 flex-col"></view>
        </view>
      </view>
      <view class="section7 flex-col">
        <view class="layer3 flex-row">
          <view class="group2 flex-col"></view>
          <view class="group3 flex-col">
            <view class="group4 flex-col"></view>
          </view>
          <view class="group5 flex-col"></view>
          <view class="group6 flex-col"></view>
        </view>
      </view>
    </view>
  </view>
</template>
<script>
export default {
  data() {
    return {
      loopData0: [
        {
          lanhuBg0:
            'url(https://lanhu.oss-cn-beijing.aliyuncs.com/SketchPng0485c4f4889c410cd86ccdfce2ac55bce7407cfad05510780f41615f414f2988) -23px -1px no-repeat',
          lanhutext0: '全部',
          lanhufontColor0: 'rgba(255,255,255,1)'
        },
        {
          lanhuBg0:
            'url(https://lanhu.oss-cn-beijing.aliyuncs.com/SketchPng931bf96c9897ab72d796a01f4c66b1753525053db86d88c9d1817b2212a5a257) -23px -1px no-repeat',
          lanhutext0: '虚拟人',
          lanhufontColor0: 'rgba(97,97,97,1)'
        },
        {
          lanhuBg0:
            'url(https://lanhu.oss-cn-beijing.aliyuncs.com/SketchPng931bf96c9897ab72d796a01f4c66b1753525053db86d88c9d1817b2212a5a257) -23px -1px no-repeat',
          lanhutext0: '品牌',
          lanhufontColor0: 'rgba(97,97,97,1)'
        },
        {
          lanhuBg0:
            'url(https://lanhu.oss-cn-beijing.aliyuncs.com/SketchPng931bf96c9897ab72d796a01f4c66b1753525053db86d88c9d1817b2212a5a257) -23px -1px no-repeat',
          lanhutext0: '形象',
          lanhufontColor0: 'rgba(97,97,97,1)'
        },
        {
          lanhuBg0:
            'url(https://lanhu.oss-cn-beijing.aliyuncs.com/SketchPng931bf96c9897ab72d796a01f4c66b1753525053db86d88c9d1817b2212a5a257) -23px -1px no-repeat',
          lanhutext0: '卡通',
          lanhufontColor0: 'rgba(97,97,97,1)'
        }
      ],
      constants: {}
    };
  },
  methods: {}
};
</script>
<style lang='css'>
@import '../common/common.css';
@import './assets/style/index.rpx.css';
</style>
